import { Button, Image } from '../.';
import type { ButtonProps } from 'antd';
import styles from './index.module.scss';
import React from 'react';

enum TYPE {
  search = '',
  refresh = '',
  alarm = '',
  add = '',
  arrowleft = '',
  arrowright = '',
}
type TYPES = keyof typeof TYPE;
interface newButtonProps extends ButtonProps {
  icon: TYPES;
  imagestyle?: Array<number>;
}
const App: React.FC<newButtonProps> = ({ icon, imagestyle = [16, 16], ...props }) => {
  if (['arrowleft', 'arrowright'].includes(icon)) {
    return (
      <span className={styles.dark}>
        <Button
          icon={
            <Image src={TYPE[icon]} width={imagestyle[0]} height={imagestyle[1]} preview={false} />
          }
          {...props}
        >
          {props.children}
        </Button>
      </span>
    );
  } else {
    return (
      <span className={styles.image}>
        <Button
          icon={
            <Image src={TYPE[icon]} width={imagestyle[0]} height={imagestyle[1]} preview={false} />
          }
          {...props}
        >
          {props.children}
        </Button>
      </span>
    );
  }
};
export default App;
